<template>
  <div class="app-container home">
    <!-- 当角色为 'dragon' 时，渲染 index 组件 -->
    <index v-if="roles === 'dragon' || roles === 'admin' "/>
    <!-- 当角色为 'common' 时，渲染 index_v1 组件 -->
    <index_v1 v-else-if="roles === 'common' || roles === 'caiwu'"/>
    <!-- 当角色为其他情况时，渲染默认组件或提示信息 -->
    <div v-else>
      <h1>您没有权限访问该页面</h1>
    </div>
    </div>
</template>

<script>
  import index from "@/views/consumer/statistic/index.vue";
  import index_v1 from "@/views/index_v1.vue";
  export default {
    name: "Index",
    components: {index,index_v1},
    created() {
      this.getRole();
    },

    data() {
      return {
        roles: ""
      };
    },

    methods: {
      getRole() {
        var roles = this.$store.state.user.roles[0];
        this.roles = roles;
      console.log("当前登录用户权限" , roles);
      }
    }
  }

</script>

<style scoped lang="scss">

</style>
